<?php

/* @var $this \yii\web\View */
/* @var $content string */

use yii\helpers\Html;
use frontend\assets\AppAsset;

use common\components\Tools;

$pre_url = Yii::$app->params['imgurl'];
$logo = $pre_url . Tools::getValue('site_logo');
$qq = Tools::getValue('site_qq');
$phone = Tools::getValue('site_phone');
$list = Tools::getTopmenu();
$site_keyword = Tools::getValue('site_keyword');
$site_title = Tools::getValue('site_title');
$site_description = Tools::getValue('site_description');

AppAsset::register($this);

$this->registerCss("
    body{font-family: sans-serif;}
    .body .menu-item{text-align:center;margin:0 -15px;padding:5px 0px}
    .body .menu-item a{color:#fff;font-size:16px;font-weight:500;text-decoration: none;}

    .myfooter{position: fixed;bottom:0px;left:0px;width:100%;height:50px;background:#F6C900;border-top-left-radius: 10px;border-top-right-radius:10px;box-shadow: 0 0 5px #F6C900;display: flex;align-items: center;text-align: center;}

    input{width:100%;height:44px;background:#F4F4F6;outline:none;border:0px;padding-left:15px}
    textarea{height:100px;width:100%;background:#F4F4F6;outline:none;border:0px;padding:15px}
    button{width:100%;height:44px;margin-top:30px;background:#F6C900;color:#fff;font-size:18px;line-height44px;outline:none;border:0px}
    
    .link-list{margin-top:30px}
    .link-list ul{padding: 0px;margin: 0px}
    .link-list ul li{list-style: none;float: left;padding: 0px 20px;height:40px}
    .link-list ul li a{color:#333;letter-spacing: 1px;}
    .link-list ul li:hover a{font-size: 16px;color:#FFD931;transition: all 0.5s;}
");
?>
<?php $this->beginPage() ?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="<?= Yii::$app->charset ?>">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1, user-scalable=0">
    <meta name="keywords" content="<?=$site_keyword?>">
    <meta name="Description" content="<?=$site_description?>">
    <meta name=“baidu-site-verification” content=“AoPI6dvSVn” />
    <?= Html::csrfMetaTags() ?>
    <?php if(empty($this->title)){ ?>
        <title><?=$site_title?></title>
    <?php }else{ ?>
        <title><?= Html::encode($this->title) ?></title>
    <?php }?>
    <?php $this->head() ?>
    <script>
        var _hmt = _hmt || [];
        (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?6d6d2be7d17b09986f5065cf030ac590";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>

</head>
<body>
<?php $this->beginBody() ?>

<div class="body">
    <div class="header" style="width:100%;background: #F6C900">
<!--        <div style="position: relative">-->
<!--            <img src="/img/header-bg.png" alt="" style="width:100%">-->
<!--            <div style="position: absolute;top:0px;left:0px;width:100%">-->
<!--                <p class="logo"><a href="/"><img src="--><?//=$logo?><!--" alt="银杏树论文网" style="width:148px"></a></p>-->
<!--            </div>-->
<!--        </div>-->
        <p class="logo" style="padding: 18px 20px;background: url(/img/header-bg.jpeg) no-repeat left;background-size: cover;margin-bottom: 0px"><a href="/"><img src="<?=$logo?>" style="width:148px" alt="银杏树论文网"></a></p>
        <div class="menu" style="padding: 10px 20px;">
           <div class="row">
                <?php foreach($list as $v){ ?>
                 <div class="col-xs-3">
                      <div class="menu-item">
                          <a href="<?=$v['code']?>"><?=$v['title']?></a>
                      </div>
                 </div>
                 <?php }?>
           </div>
        </div>
    </div>

    <div class="">
        <?= $content ?>
    </div>

    <div class="sec-contact" style="width:100%;padding: 40px 20px;text-align: center;background: #F7F7F7">
        <div class="title" style="color:#333;font-size:28px;font-weight:500;margin-bottom: 5px">联系我们</div>
        <p class="desc" style="text-transform: uppercase;">CONTACT US</p>
        <div style="margin-top: 20px;padding: 30px 20px;background: #fff;box-shadow: 0 0 5px #fff">
            <div class="form-item">
                <input type="text" id="contact-name" name="name" placeholder="姓名">
            </div>

            <div class="form-item" style="margin-top: 20px">
                <input type="text" id="contact-phone" name="phone" placeholder="手机号码">
            </div>

            <div class="form-item" style="margin-top: 20px">
                <textarea rows="3" id="contact-content" placeholder="留言内容…"></textarea>
            </div>

            <button type="submit" id="submit">提交</button>

        </div>
    </div>

    <div class="sec-links" style="text-align: center;padding: 40px 20px 80px 20px">
        <div class="title" style="color:#333;font-size:28px;font-weight:500;margin-bottom: 5px">友情链接</div>
        <p class="desc" style="text-transform: uppercase;">LINKS</p>
        <div class="link-list" style="">
            <ul>
                <?php foreach(Tools::getLinkList() as $v){ ?>
                    <li><a href="<?=$v['url']?>" target="_blank" title="<?=$v['title']?>"><?=$v['title']?></a></li>
                <?php }?>
            </ul>
            <div class="clearfix"></div>
        </div>
    </div>

    <div class="myfooter">
        <div style="flex: 1;">
            <a href="http://wpa.qq.com/msgrd?v=3&uin=<?=$qq?>&site=qq&menu=yes" style="color:#fff">
                <p style="margin: 0px"><img src="/img/qq2@2x.png" style="width:22px"></p>
                <p style="margin: 0px;font-size: 12px;color:#fff;">QQ咨询</p>
            </a>
        </div>
        <div style="flex: 1;">
            <a href="tel:<?=$phone?>" style="color:#fff">
                <p style="margin: 0px"><img src="/img/dianhua2@2x.png" style="width:22px"></p>
                <p style="margin: 0px;font-size: 12px;color:#fff;">电话咨询</p>
            </a>
        </div>
    </div>

</div>



<?php $this->endBody() ?>
</body>
</html>
<?php $this->endPage() ?>
<script type="text/javascript" src="https://cdn.bootcss.com/layer/2.3/layer.js"></script>
<script>
    $('#submit').click(function(){

        var name = $('#contact-name').val();
        if(!name){
            layer.msg('姓名不能为空');
            return;
        }

        var phone = $('#contact-phone').val();
        if(!phone){
            layer.msg('电话号码不能为空');
            return;
        }

        var cont = $('#contact-content').val();
        if(!name){
            layer.msg('留言内容不能为空');
            return;
        }

        if(!isPhoneNo(phone)){
            layer.msg('电话号码格式不正确');
            return;
        }

        var sta = true;
        if(sta){
            sta = false;
            $.ajax({
                url : '/home/default/check',
                type: 'POST',
                data: {
                    'username' : name,
                    'phone' : phone,
                    'cont' : cont,
                },
                dataType:'json',
                success: function (res) {
                    sta = true;
                    if(res.code == 200){
                        layer.msg('留言成功');
                    }else{
                        layer.msg(res.message);
                    }
                    console.log(res);
                },
                error:function(err){
                    console.log(err);
                }
            });
        }

    });

    function isPhoneNo(phone) {
        var pattern = /^1[34578]\d{9}$/;
        return pattern.test(phone);
    }
</script>